<%@ page pageEncoding="UTF-8"%>
<%@ include file="/common/taglibs.jsp"%>

<!DOCTYPE html>
<html>
<head>
	<title>秀场 | ${album.name} - ${website}</title>
	<%@ include file="/common/meta.jsp"%>
	<link href="${cdn}/css/pxmain${pageScope.pxmainCssVersion}.css" rel="stylesheet" type="text/css"></link>
</head>
<body>
	<%@ include file="/common/sitenav.jsp"%>
	<jsp:include page="/common/home-header.jsp">
		<jsp:param value="albums" name="column" />
	</jsp:include>
	
	
	<input id="current-user-id" type="hidden" value="${sessionScope.currentUser.userId}">
	<input id="current-user-avatar" type="hidden" value="${sessionScope.currentUser.avatar}">
	<input type="hidden" id="album-id" value="${album.id}">
  	<input type="hidden" id="init-photo-id" value="${photoId}">	
  	<input type="hidden" id="photo-id" value="${photoId}">	
  		
	<section id="page1" class="vipPic userShow">
		<header class="showPicTitle pr">
        	<a href="${ctx}/albums/shows">秀场</a>
        	<span class="AlbumName"><a href="${ctx}/albums/gallery/${album.galleryId}/shows">${album.galleryName}</a></span>
            <span class="AlbumName"><a href="${ctx}/albums/${album.id}/detail">${album.name}</a></span>
            <span class="AlbumName">当前相片</span>
        </header>
    	<div id="container" class="ptl">
			<div class="navigation-container pr">
				<div class="pre-album pa">
					<a href="#">
						<img src="../images/demo/pre1.jpg" alt="" />
						<em>上一个图集</em>
					</a>
				</div>
				<div id="thumbs" class="navigation pr">
					<a class="pageLink prev" href="#" title="上一页"></a>
					<ul class="thumbs">
						<c:forEach var="photo" items="${photos}">
							<li>
								<a class="thumb" name="${photo.id}" href="${imgUrl}${photo.w900Path}" title="">
									<img src="${imgUrl}${photo.h80Path}" alt="${photo.title}" />
								</a>
							</li>
						</c:forEach>
					</ul>
					<a class="pageLink next" href="#" title="下一页"></a>
                    <span class="move1"><i></i></span>
				</div>
					
				<div class="next-album pa">
					<a href="#">
						<img src="../images/demo/next1.jpg" alt="" />
						<em>下一个图集</em>
					</a>
				</div>
			</div>
			<div class="show-content">
				<div id="caption" class="caption-container">
					<div class="photo-index mtm ac"><h1 class="inline">${photo.title}</h1><span></span></div>
				</div>
				<div class="slideshow-container pr">
					<div id="controls" class="controls"></div>
					<div id="loading" class="loader"></div>
					<div id="slideshow" class="slideshow"></div>
				</div>
			</div>
				
			<div style="clear: both;"></div>
		</div>
			
		<section class="recommend1 mvm mlxxl">
			<a id="like-photo-btn" href="javascript:;" class="praise1">
				<i></i><span id="like-photo-text">赞</span>
			</a> | 
			<a id="favor-photo-btn" href="javascript:;" class="favorite1">
				<i></i><span id="favor-photo-text">收藏</span>
				<span id="favor-photo-num-wrapper">
					<c:if test="${photo.favors gt 0}">
						(<span class="tcolor" id="favor-photo-num">${photo.favors}</span>)
					</c:if>
				</span>
			</a>
		</section>
	    <section class="mvs mlxxl hidden" id="likes-content">
			<h2><span><em id="like-photo-num">${photo.likes}</em>个人赞过它！</span> </h2>
			<div id="likes-user-list">
			</div>
		</section>
		<%-- End相册 --%>
		
		<%-- st评论 --%>
		<div class="section clearfix mtl">
			<div class="commentbody lfloat" style="width:100%;">
				<div class="commentTxt clearfix phxl pvs">
					<form action="" method="post">
						<textarea></textarea>
						<div class="comment-ico lfloat"></div>
						<div class="comment-submit rfloat mts">
							<label><input type="checkbox" /> 转发给我的粉丝</label>
							<button type="button">评论</button>
						</div>
					</form>
				</div>
				<div class="commentList mhxl">
					<ul class="commentData mvm">
						<li class="comment-detail clearfix">
							<div class="commentPic">
								<a href="#"><img src="../images/demo/userPic.jpg" alt="" /></a>
							</div>
							<div class="commentText">
								<div class="userName">
									<strong>
										<a title="" href="#" class="fcolor">李颖芝</a><a class="vip" target="_blank" title="认证" href="#"><i class="zan-ico"></i></a>
									</strong>:&nbsp;
								</div>
								<div class="msgCnt">
									对待感情不作伪真的很难呢，也未必是正确的行为，因为人性，以及人的行为很复杂。
								</div>
								<div class="commentTime">
									( 10秒前 )
								</div>
							</div>
						</li>
						<li class="comment-detail clearfix">
							<div class="commentPic">
								<a href="#"><img src="../images/demo/userPic5.jpg" alt="" /></a>
							</div>
							<div class="commentText">
								<div class="userName">
									<strong>
										<a title="" href="#" class="fcolor">天山童姥</a><a class="vip" target="_blank" title="认证" href="#"><i class="zan-ico"></i></a>
									</strong>:&nbsp;
								</div>
								<div class="msgCnt">
									对待感情不作伪真的很难呢。
								</div>
								<div class="commentTime">
									( 10秒前 )
								</div>
							</div>
						</li>
						<li class="comment-detail clearfix">
							<div class="commentPic">
								<a href="#" ><img src="../images/demo/userPic2.jpg" alt="" /></a>
							</div>
							<div class="commentText">
								<div class="userName">
									<strong>
										<a title="" href="#" class="fcolor">小不点</a><a class="vip" target="_blank" title="认证" href="#"><i class="zan-ico"></i></a>
									</strong>:&nbsp;
								</div>
								<div class="msgCnt">
									对待感情不作伪真的很难呢，也未必是正确的行为。
								</div>
								<div class="commentTime">
									( 10秒前 )
								</div>
							</div>
						</li>
					</ul>
				</div>
				<div class="blog-more rfloat mal"><a href="#">&gt;&gt;更多</a></div>
			</div>
           
		</div>
		<%-- end评论 --%>
    </section>
    
    <%@ include file="/common/footer.jsp"%>
    
    <script type="text/javascript" src="${cdn}/js/jquery/galleriffic/jquery.galleriffic.js"></script>
	<script type="text/javascript" src="${cdn}/js/jquery/galleriffic/jquery.history.js"></script>
	<script type="text/javascript" src="${cdn}/js/jquery/galleriffic/jquery.opacityrollover.js"></script>
    <script type="text/javascript" src="${cdn}/js/px/album/photo/shows${pageScope.albumPhotoShowsJsVersion}.js"></script>
</body>
</html>
